//
//  HHColorSample.swift
//  HHSwiftuiPractice
//
//  Created by HongMac on 2023/9/25.
//颜色｜渐变

import SwiftUI

struct HHColorSample: View {
    
    //var color = #colorLiteral  按下左括号
    var tempcolor = #colorLiteral(red: 0.1764705926, green: 0.01176470611, blue: 0.5607843399, alpha: 1)
    
    var body: some View {
        
        VStack{
            RoundedRectangle(cornerRadius: 20)
    //            .fill(
    //                Color(tempcolor)
    //            )
                .frame(width: 150, height: 200, alignment: .center)
    //            .foregroundColor(Color("CustomColor")) //自定义颜色 适配暗黑模式
                .foregroundColor(Color(tempcolor))
            
        ///LinearGradient 线性渐变
            ///LinearGradient 用于创建沿着一条直线方向的颜色渐变效果。
            ///它需要指定起点和终点，渐变将在这两个点之间进行插值。
            ///适用于创建左到右、上到下或者任意方向的颜色过渡效果。
            
            RoundedRectangle(cornerSize: CGSize(width: 20, height: 20))
                .fill(
                    LinearGradient(colors: [Color.green,Color.blue], startPoint: .topLeading, endPoint: .bottomTrailing)
                )
                .frame(width: 150, height: 50, alignment: .center)
            
        ///AngularGradient 角度渐变
            ///AngularGradient 用于创建围绕中心点的角度方向的颜色渐变效果。
            ///它需要指定颜色数组和中心点，渐变将根据颜色数组在角度上进行插值。
            ///适用于创建类似扇形或者类似彩虹的颜色渐变效果
            
           RoundedRectangle(cornerRadius: 20)
                .fill(
                    AngularGradient(colors: [Color.green,
                                             Color.blue,
                                             Color.yellow
                                            ], center: .center, startAngle: .degrees(0), endAngle: .degrees(360))
                )
                .frame(width: 150, height: 150)
            
         ///RadialGradient 径向渐变
            ///RadialGradient 用于创建从一个中心点向外径向扩展的颜色渐变效果。
            ///它需要指定起始半径和结束半径，颜色将在这两个半径之间进行插值。
            ///适用于创建类似光照的径向渐变或者类似水波纹的效果。
            
            RoundedRectangle(cornerRadius: 25)
                .fill(
                    RadialGradient(colors: [
                        Color.green,
                        Color.blue
                    ], center: .center, startRadius: 5, endRadius: 150)
                )
                .frame(width: 150, height: 150)

            
        }
        
    }
}

struct HHColorSample_Previews: PreviewProvider {
    static var previews: some View {
        HHColorSample()
    }
}
